<template>
    <div>
        <el-table
            :data="tableData"
            @selection-change="getSelectVal"
            stripe
            style="width: 100%"
        >
            <el-table-column
                type="selection"
                width="55"
                align="center"
            ></el-table-column>
            <el-table-column
                type="index"
                width="55"
                label="序号"
                align="center"
            />
            <el-table-column
                prop="materialCode"
                label="物料编码"
            ></el-table-column>
            <el-table-column
                prop="materialName"
                label="物料名称"
            ></el-table-column>
            <el-table-column prop="model" label="规格型号"></el-table-column>
            <el-table-column
                prop="createTime"
                label="创建日期"
            ></el-table-column>
            <el-table-column prop="brand" label="品牌"></el-table-column>
            <el-table-column prop="oneTypeName" label="大类分类名称">
            </el-table-column>
            <el-table-column
                prop="towTypeName"
                label="中类分类名称"
            ></el-table-column>
        </el-table>
        <div style="display: flex; justify-content: space-between">
            <el-pagination
                class="pagination"
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"
                :current-page="page"
                :page-sizes="[10, 20, 30, 40]"
                :page-size="limit"
                layout="total, sizes, prev, pager, next, jumper"
                :total="total"
            >
            </el-pagination>
            <!-- <div>
        <el-button size="small" type="primary" @click="submit">确定</el-button>
        <el-button
          size="small"
          type="primary"
          @click="$emit('update:visible', false)"
          >取消</el-button
        >
      </div> -->
        </div>
    </div>
</template>

<script>
import { getMaterialList } from "@/api/system/purchase";
export default {
    data() {
        return {
            tableData: [],
            page: 1, //当前页
            limit: 10, //每页条数
            total: 0,
            rowList: [],
        };
    },
    methods: {
        //分页器size
        handleSizeChange(val) {
            this.limit = val;
            this.getDataList();
        },
        //分页器当前页
        handleCurrentChange(val) {
            this.page = val;
            this.getDataList();
        },
        getSelectVal(val) {
            this.$emit("update:visible", false);
            this.$emit("getSelectVal", val);
        },
        // submit() {
        //   if (this.rowList.length) {
        //     this.$emit("update:visible", false);
        //     this.$emit("getSelectVal", this.rowList);
        //   } else {
        //     this.$message.warning("请至少选择一项");
        //   }
        // },
        getDataList() {
            getMaterialList({
                type: 1,
                page: this.page,
                limit: this.limit,
            }).then((res) => {
                this.tableData = res.data.records;
            });
        },
    },
    mounted() {
        this.getDataList();
    },
};
</script>

<style></style>
